<template>
  <div class="grass">
    <div>
      <div class="grass-item">
        <div class="grass-body">
          <div class="grass-make">
            <router-link :to="{ path:'/user-cartbalance', query: { type: 'slverflower' }}">
              <img src="/static/img/slverflower.png" alt="vip">
              <button class="buttonMall">购买会员卡</button>
            </router-link>
          </div>
          <div class="grass-body-title">等级门槛政策介绍</div>
          <div class="grass-body-content">
            <dl>
              <dt>1、</dt>
              <dd>麦苗(0元注册)</dd>
            </dl>
            <dl>
              <dt>2、</dt>
              <dd>种草(次性充值大于等于399元，或团队累计销售额大于等于1600元自动升级)  种草连续两月团队销售额不满1 20元，自动降为麦苗。</dd>
            </dl>
            <dl>
              <dt>3、</dt>
              <dd>银花(一次性充值大于等于5000元，或团队累计销售额大于等于2万元自动升级)  银花连续两月团队累计销售额不满1500元，自动降为种草。</dd>
            </dl>
            <dl>
              <dt>4、</dt>
              <dd>金花(一次性充值大于等于2万元，或团队累计销售额大于等于8万元自动升级)  金花连续两月团队累计销售额不满6000元，自动降为银花</dd>
            </dl>
            <dl>
              <dt>5、</dt>
              <dd>牡丹(一次性充值大于等于5万元，或团队累计销售额大于等于20万元自动升级)  牡丹连续两月团队累计销售额不满1.5万元，自动降为金花。</dd>
            </dl>
          </div>
          <div class="text-right">最终解释权归美麦商城所有</div>
        </div>
      </div>
    </div>
    <public-menu></public-menu>
  </div>
</template>

<script>
import PublicMenu from '../public/Menu'
export default {
  name: 'SilverFlower',
  components: {
    PublicMenu
  }
}
</script>

<style lang="stylus" scoped>
@import '~styles/mixins.styl'
.grass
  background: #f3f3f3
  margin-bottom: 1.8rem
  .grass-make
    margin: 0.3rem 0.8rem .3rem
    box-sizing: border-box
    position: relative
    img
      width: 100%
      height: auto
  .grass-item
    background: #fff
    padding: 0.3rem 0.2rem
    .grass-body
      margin: 0.3rem 0
      .grass-body-title
        font-size: 0.36rem
        text-align: left
        line-height: 0.6rem
        font-weight: 700
        margin-bottom: 0.2rem
        border-left: 5px solid red
        padding-left: .2rem
        ellipsis()
      .grass-body-content
        font-size: 0.28rem
        line-height: 0.49rem
        margin-bottom: 0.2rem
        box-sizing: border-box
        dt,dd
          display: inline-block
        dt
          width: 8%
        dd
          width: 90%
      .text-right
        font-size: 0.24rem
        color: #ccc
  .buttonMall
    height: 0.8rem
    line-height: 0.8rem
    text-align: center
    color: #fff
    border-radius: 0.8rem !important
    font-size: 0.5rem
    margin: 0.3rem auto 0 auto
    background-color: #868686
    position: absolute
    bottom: 0.4rem
    width: 100%
    box-sizing: border-box
</style>
